import React from 'react';
import axios from 'axios';
import UseRequest from './ahooks/useRequest';
import UseVirtualList from './ahooks/useVirtualList';
import useLockFn from './usehooks/useLockFn';
import useModalVisible from './usehooks/useModalVisible';
import Exemple from './Exemple';

const Index = () => {
  const [{ isModalVisible, test }, { setTrue, setFalse }, fn] = useModalVisible({
    isModalVisible: false, // 提交申请弹框
    test: false,
  });
  const [isLoading, handleClick] = useLockFn(async params => {
    console.log('🚀 ~ file: index.jsx ~ line 8 ~  params', params);
    await axios.get('/getList');
  });
  return (
    <div style={{ padding: 50 }}>
      <button type="button" onClick={() => handleClick({ pageSize: 10 })}>
        点击
      </button>
      {JSON.stringify(isLoading)}
      <UseRequest />
      <UseVirtualList />
      <p> isModalVisible:{JSON.stringify(isModalVisible)}</p>
      <p>test:{JSON.stringify(test)}</p>
      <button type="button" onClick={() => setTrue(['test'])}>
        set test True
      </button>
      <button type="button" onClick={() => setFalse(['isModalVisible'])}>
        set isModalVisible False
      </button>
      <button type="button" onClick={fn}>
        fnLock
      </button>
      <Exemple />
    </div>
  );
};

export default Index;
